@import "util.less";

@color: #ffaa00;




.com-big-box{
	float: left;
	width: 100%;
}

@media (min-width: 880px){
.com-header{
	width: 100%;
	position: fixed;
	z-index: 1111;
	background: #282b33;
	height: 58px;
	// box-shadow:    0px -10px 0px 0px #ff0000,   /*上边阴影  红色*/
 //                -10px 0px 0px 0px #3bee17,   /*左边阴影  绿色*/
 //                10px 0px 0px 0px #2279ee,    /*右边阴影  蓝色*/
 //                0px 10px 0px 0px #eede15;    /*下边阴影  黄色*/
 	
 	box-shadow:0 -6px 41px #808080;
	.school-logo{
		width: 178px;
		height: 18px;
		float: left;
		margin-top: 20px;
		margin-left: 13px;
		img{
			display: block;
			width: 100%;
			height: 100%;
		}
	}
	.menu-btn{
		display: none;
	}
	.right-gr{
		float: right;
		display: table;
		height: 100%;
		margin-right: 15px;
		i{
			float: left;
			display: block;
			line-height: 58px;
			color: #fff;
			font-size: 30px;
		}
		.p-welcome{
			float: left;
			margin-left: 8px;
			font-size: 14px;
			color: #fff;
			line-height: 58px;
		}
		.goout{
			float: left;
			line-height: 58px;
			color: #fff;
			font-size: 14px;
			margin-left: 22px;
		}
	}
}
.com-fixed-left{
	position: fixed;
    top: 58px;
    bottom: 0;
    left: 0;
    width: 200px;
    padding: 10px 0;
    margin-top: 0;
    overflow-y: auto;
    background: #393d49;
    box-shadow: -6px 0px 41px #808080;
    z-index: 99999999;
    .item{
		display: block;
		width: 100%;
		height: 36px;
		margin-bottom: 6px;
		line-height: 36px;
		.boz;
		border-left: 3px solid #393d49;
		&:hover{
			background: #4e5465;
			border-color: @color;
			i{
				display: block;
			}
		}
		p{
			float: left;
			font-size: 14px;
			color: #fff;
			margin-left: 30px;
		}
		i{
			display: none;
			font-size: 16px;
			color: @color;
			float: right;
			margin-right: 8px;
		}
		&:first-child{
			margin-top: 14px;
		}
	}
	.item-act{
		background: #4e5465;
		border-color: @color;
		i{
			display: block;
		}
	}
}
}
@media (max-width: 879px){
.com-header{
	width: 100%;
	position: fixed;
	z-index: 1111;
	background: #282b33;
	height: 74px;
	// box-shadow:    0px -10px 0px 0px #ff0000,   /*上边阴影  红色*/
 //                -10px 0px 0px 0px #3bee17,   /*左边阴影  绿色*/
 //                10px 0px 0px 0px #2279ee,    /*右边阴影  蓝色*/
 //                0px 10px 0px 0px #eede15;    /*下边阴影  黄色*/
 	
 	box-shadow:0 -6px 41px #808080;
	.school-logo{
		width: 178px;
		height: 18px;
		margin: auto;
		margin-top: 8px;
		margin-bottom: 9px;
		img{
			display: block;
			width: 100%;
			height: 100%;
		}
	}
	.menu-btn{
		display: block;
		float: left;
		width: 50px;
		height: 34px;
		text-align: center;
		line-height: 34px;
		cursor: pointer;
		i{
			color: #fff;
			font-size: 17px;
			line-height: 34px;
			display: none;
		}
		.icon-act{
			display: block;
		}
	}
	.right-gr{
		float: right;
		display: table;
		margin-right: 8px;
		i{
			float: left;
			display: block;
			line-height: 34px;
			color: #fff;
			font-size: 28px;
		}
		.p-welcome{
			float: left;
			margin-left: 8px;
			font-size: 14px;
			color: #fff;
			line-height: 34px;
			display: none;
		}
		.goout{
			float: left;
			line-height: 34px;
			color: #fff;
			font-size: 14px;
			margin-left: 12px;
		}
	}
}
.com-fixed-left{
	position: fixed;
    top: 74px;
    bottom: 0;
    width: 200px;
    padding: 0px 0;
    margin-top: 0;
    overflow-y: auto;
    background: #393d49;
    box-shadow: -6px 0px 41px #808080;
    transform: translateX(-250px);
    z-index: 9999999;
    .item{
		display: block;
		width: 100%;
		height: 36px;
		margin-bottom: 6px;
		line-height: 36px;
		.boz;
		border-left: 3px solid #393d49;
		&:hover{
			background: #4e5465;
			border-color: @color;
			i{
				display: block;
			}
		}
		p{
			float: left;
			font-size: 14px;
			color: #fff;
			margin-left: 30px;
		}
		i{
			display: none;
			font-size: 16px;
			color: @color;
			float: right;
			margin-right: 8px;
		}
		&:first-child{
			margin-top: 14px;
		}
	}
	.item-act{
		background: #4e5465;
		border-color: @color;
		i{
			display: block;
		}
	}
}
}


@media (min-width: 1280px){
.com-page-wrapper{
	margin: 58px 0px 0 200px;
	.two-nav-box{
		padding: 0 20px;
		.zoom;
		background: #4d4d4d;
		.list{
			display: block;
			height: 50px;
			float: left;
			.boz;
			&:hover{
				border-top: 3px solid @color;
				background: #393d49;
			}
			p{
				font-size: 14px;
				color: #fff;
				line-height: 47px;
				padding: 0 15px;
			}
		}
		.list-act{
			border-top: 3px solid @color;
			background: #393d49;
		}
	}
	.sj_menu{
		display: none;
	}
}
}
@media (min-width: 880px) and (max-width: 1279px){
	.com-page-wrapper{
		margin: 58px 0px 0 200px;
		.two-nav-box{
			padding: 0 20px;
			.zoom;
			background: #4d4d4d;
			.list{
				display: block;
				height: 50px;
				float: left;
				.boz;
				&:hover{
					border-top: 3px solid @color;
					background: #393d49;
				}
				p{
					font-size: 14px;
					color: #fff;
					line-height: 47px;
					padding: 0 15px;
				}
			}
			.list-act{
				border-top: 3px solid @color;
				background: #393d49;
			}
		}
		.sj_menu{
			display: none;
		}
	}
}
@media (max-width: 879px){
.com-page-wrapper{
	width: -webkit-calc(~'100% - 20px');
	width: -moz-calc(~'100% - 20px');
	width: calc(~'100% - 20px');
	margin: 74px 10px 0 10px;
	// transform: translateX(0px);
	// position: absolute;
	// overflow-y: auto;
	min-height: 500px;
	.two-nav-box{
		width: 100%;
		.zoom;
		display: none;
		.list{
			display: block;
			height: 28px;
			float: left;
			border: 1px solid #8f8f8f;
			margin-right: 4px;
			margin-bottom: 10px;
			&:hover{
				border-color: @color;
				p{
					color: @color;
				}
			}
			p{
				font-size: 12px;
				color: #8f8f8f;
				line-height: 28px;
				padding: 0 20px;
				color: #8f8f8f;
				.huizhan{
					margin-left: 6px;
    				margin-top: -6px;
    				background: #fd0000;
				}
			}
		}
		.list-act{
			border-color: @color;
			p{
				color: @color;
			}
		}
	}
	.sj_menu{
		display: block;
		float: right;
		margin-top: 10px;
		border: 1px solid #d6d6d6;
		border-radius: 4px;
		width: 150px;
		height: 32px;
		position: relative;
		.navtxt{
			padding: 0 6px;
			line-height: 32px;
			.zoom;
			cursor: pointer;
			p{
				float: left;
				font-size: 14px;
				color: #333;
			}
			.navicon{
				display: none;
				float: right;
				color: #666;
			}
			.icon-xia{
				display: block;
			}
		}
		.dropdown-menu{
			position: absolute;
			top: 36px;
			width: 100%;
			border-radius: 4px;
			padding: 6px 0;
			.zoom;
			border: 1px solid #d6d6d6;
			display: none;
			z-index: 99999;
			background: #fff;
			.lista{
				display: block;
				padding: 0 6px;
				height: 30px;
				font-size: 14px;
				color: #333;
				line-height: 30px;
				&:hover{
					background: #f5f5f5;
				}
			}
		}
	}
	.sj_menu-act{
		.navtxt{
			.navicon{
				display: none;
			}
			.icon-shang{
				display: block;
			}
		}
		.dropdown-menu{
			display: block;
		}
	}
}
.com-page{
	text-align: center;
	margin: auto;
	.pagination{
		margin: auto;
	}
}
}

@media(min-width: 880px){
	.connentBox{
		padding: 20px;
		height: auto;
		zoom: 1;
	}
}
@media(max-width: 879px){
	.connentBox{
		width: 100%;
		padding: 20px 0px;
		height: auto;
		zoom: 1;
	}
	.layui-form-label{
		padding: 9px 5px 9px 0;
	}
	.layui-input-block{
		margin-left: 92px;
	}
}

@media(min-width: 1000px){
	.edit_details_page{
		width: 100%;
		.zoom;
		margin-top: 10px;
		margin-bottom: 20px;
		.p-head{
			font-size: 16px;
			font-weight: bold;
			color: #333;
		}
		.big_width{
			width: 100%;
			height: 500px;
			.boz;
			border: 1px solid #d6d6d6;
			border-radius: 4px;
			margin-top: 12px;
		}
		.small_width{
			width: 100%;
			.zoom;
			display: none;
			p{
				font-size: 14px;
				color: #d9534f;
				font-weight: bold;
				text-align: center;
				line-height: 60px;
			}
		}
	}
}
@media(max-width: 999px){
	.edit_details_page{
		width: 100%;
		.zoom;
		margin-top: 10px;
		margin-bottom: 20px;
		.p-head{
			font-size: 16px;
			font-weight: bold;
			color: #333;
		}
		.big_width{
			width: 100%;
			height: 500px;
			.boz;
			border: 1px solid #d6d6d6;
			border-radius: 4px;
			margin-top: 12px;
			display: none;
		}
		.small_width{
			width: 100%;
			.zoom;
			p{
				font-size: 14px;
				color: #d9534f;
				font-weight: bold;
				text-align: center;
				padding: 20px 0;
			}
		}
	}
}

::-webkit-scrollbar-track-piece { //滚动条凹槽的颜色，还可以设置边框属性
background-color:#f8f8f8;
}
::-webkit-scrollbar {//滚动条的宽度
width:8px;
height:8px;
}
::-webkit-scrollbar-thumb {//滚动条的设置
background-color:#dddddd;
background-clip:padding-box;
min-height:28px;
}
::-webkit-scrollbar-thumb:hover {
background-color:#bbb;
}

.com-alert-box{
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 999999;
	background: rgba(0,0,0,.64);
	left: 0;
	top: 0;
	display: none;
	@media (min-width: 680px){
		.box{
			width: 400px;
			height: 220px;
			border-radius: 12px;
			background: #fff;
			position: absolute;
			left: 50%;
			margin-left: -200px;
			top: 50%;
			margin-top: -110px;
			overflow: hidden;
			.box-head{
				width: 100%;
				height: 50px;
				border-bottom: 1px solid #d6d6d6;
				background: #d9534f;
				p{
					font-size: 16px;
					color: #fff;
					line-height: 50px;
					padding-left: 20px;
				}
			}
			.box-bd{
				width: 88%;
				height: 50px;
				margin: auto;
				margin-top: 20px;
				margin-bottom: 20px;
				text-align: center;
				p{
					font-size: 14px;
					color: #666;
					font-weight: bold;
					line-height: 28px;
				}
			}
			button{
				margin-top: 20px;
			}
		}
	}
	@media (max-width: 679px){
		.box{
			width: 280px;
			height: 180px;
			border-radius: 10px;
			background: #fff;
			position: absolute;
			left: 50%;
			margin-left: -140px;
			top: 50%;
			margin-top: -90px;
			overflow: hidden;
			.box-head{
				width: 100%;
				height: 40px;
				border-bottom: 1px solid #d6d6d6;
				background: #d9534f;
				p{
					font-size: 16px;
					color: #fff;
					line-height: 40px;
					padding-left: 10px;
				}
			}
			.box-bd{
				width: 88%;
				height: 50px;
				margin: auto;
				margin-top: 20px;
				margin-bottom: 20px;
				text-align: center;
				p{
					font-size: 14px;
					color: #666;
					line-height: 28px;
				}
			}
		}
	}
}
.com-alert-box-act{
	display: block;
}